<template>
  <a-row>
    <a-col :span="24">
      <a-card :bordered="false" style='margin-top: -20px;'>
        <!-- table区域-begin -->
        <div class="table-page-search-wrapper">
          <a-form layout="inline" @keyup.enter.native="searchQuery">
            <a-row :gutter="24">
              <a-col :md="4" :sm="5">
                <a-form-model-item label="班级" prop="classId">
                  <j-dict-select-tag v-model="queryParam.gradeId" placeholder="年级" @change="changeGradeId"
                                     dictCode="cou_grade,ifnull( grade_abbreviation !! grade_name ) ,id,tenant_id  is not null order by  grade_order"
                  style="width: 40%"/>
                  <j-dict-select-tag v-model="queryParam.classId" placeholder="请选择班级"
                                     :dictCode="this.queryParamSelect.classIdSelect"
                                     style="width: 60%"/>
                </a-form-model-item>
              </a-col>
              <div>
                <a-col :md="2" :sm="5">
                  <a-form-model-item label="科目" prop="subjectId">
                    <a-select v-model="queryParam.subjectId" placeholder="请选择科目"
                              :getPopupContainer="(target) => target.parentNode" @change="handleSubjectChange" style="width: 120%" >
                      <a-select-option v-for="item in subjectList" :key="item.value">{{ item.label }}</a-select-option>
                    </a-select>
                  </a-form-model-item>
                </a-col>
                <a-col :md="4" :sm="5">
                  <a-form-model-item label="任课教师" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="teacherId" >
                    <a-select v-model="queryParam.teacherId" placeholder="请选择任课教师"
                              :getPopupContainer="(target) => target.parentNode" >
                      <a-select-option v-for="item in teacherList" :key="item.value">{{ item.label }}</a-select-option>
                    </a-select>

<!--                    <j-multi-select-tag :options="teacherList" v-model="queryParam.teacherId" placeholder="请选择教师" >-->
<!--                    </j-multi-select-tag>-->
                  </a-form-model-item>
                </a-col>
                <a-col :md="6" :sm="5">
                  <a-form-model-item label="教室" prop="classroomId" style='width: 300px;float: left'>
                    <j-dict-select-tag @change='changeBuildingId' v-model="queryParam.buildingId" placeholder="选择教学楼" dictCode="fac_building,building_name,id" style='width: 40%'/>
                    <j-dict-select-tag v-model='queryParam.classroomId' placeholder='请选择教室'
                                       :dictCode="queryParamSelect.classroomIdSelect" style='width: 60%'/>
                  </a-form-model-item>
                </a-col>
              </div>

              <a-col :md="2" :sm="5">
                <a-form-model-item>
                  <a-button @click="handleGetData(0)" type="primary" style='margin-left: 15px;background: #0db869;border: none;'><a-icon style='font-size: 18px;' type='eye' />查课表</a-button>
                </a-form-model-item>
              </a-col>
              <a-col :md="2" :sm="5">
                <a-form-model-item>
                  <a-button @click="handleGetData(1)" type="primary" style='margin-left: 15px;background: #e5700a;border: none;'>检测冲突</a-button>
                </a-form-model-item>
              </a-col>
<!--              <a-col :md="2" :sm="5">-->
<!--                <a-form-model-item>-->
<!--                  <a-button type="primary" style='margin-left: 10px;'  @click='print2'>打印课表</a-button>-->
<!--                </a-form-model-item>-->
<!--              </a-col>-->
              <a-col :md="1" :sm="5">
                <a-form-model-item>
                  <a-button @click="initQueryParam()" type="primary" style='margin-left: 0px;border: none;'>重 置</a-button>
                </a-form-model-item>
              </a-col>
              <a-col :md="5" :sm="5">
                <a-form-model-item>
                  <div style='text-align: right;height:15px;color: #d40505;'> * 红色表示冲突型有课部分，没颜色表示不冲突</div>
                </a-form-model-item>
              </a-col>
            </a-row>
          </a-form>
        </div>

        <div id="modal-body-print2">
          <!--      <div style='text-align: center;color: #4b4b4b;font-size: 20px;padding-bottom:10px;font-weight: bold;'>{{ classname }}</div>-->
          <div style='float:left;text-align: center;background: #f5f5f5;border: 1px solid #e2e2e2;'>
            <div style='width: 110px;float: left;'>
              <div  class='week-t'><span>节次</span></div>
              <div class='week-c' style='font-size: 14px;background-color: #fafafa;' v-for='item in courseData1' :key='item' slot='item'>
                <div>{{ item.courArraAtomSectionname }}</div>
                <div>[{{ item.courArraAtomStartTime }}-{{ item.courArraAtomEndTime }}]</div>
              </div>
            </div>

            <div style='width: 220px;float: left;'>
              <div class='week-t'><span>星期一</span></div>
              <div v-for='item in courseData1' :key='item' slot='item' @click='selectBt()'>
                <div class='week-c' :style="{'background':item.arrangeContradictionColor}">
                  <div>{{ item.subjectName }}</div>
                  <div>{{ item.teacherName }}</div>
                  <div>{{ item.classroomNickname }} </div>
                  <div>{{ item.classNicknameView }} </div>
                </div>
              </div>
            </div>
            <div style='width: 200px;float: left;'>
              <div class='week-t'><span>星期二</span></div>
              <div v-for='item in courseData2' :key='item' slot='item'>
                <div class='week-c' :style="{'background':item.arrangeContradictionColor}">
                  <div>{{ item.subjectName }}</div>
                  <div>{{ item.teacherName }}</div>
                  <div>{{ item.classroomNickname }} </div>
                  <div>{{ item.classNicknameView }} </div>
                </div>
              </div>
            </div>
            <div style='width: 220px;float: left;'>
              <div class='week-t'><span>星期三</span></div>
              <div v-for='item in courseData3' :key='item' slot='item'>
                <div class='week-c' :style="{'background':item.arrangeContradictionColor}">
                  <div>{{ item.subjectName }}</div>
                  <div>{{ item.teacherName }}</div>
                  <div>{{ item.classroomNickname }} </div>
                  <div>{{ item.classNicknameView }} </div>
                </div>
              </div>
            </div>
            <div style='width: 220px;float: left;'>
              <div class='week-t'><span>星期四</span></div>
              <div v-for='item in courseData4' :key='item' slot='item'>
                <div class='week-c' :style="{'background':item.arrangeContradictionColor}">
                  <div>{{ item.subjectName }}</div>
                  <div>{{ item.teacherName }}</div>
                  <div>{{ item.classroomNickname }} </div>
                  <div>{{ item.classNicknameView }} </div>
                </div>
              </div>
            </div>
            <div style='width: 220px;float: left;'>
              <div class='week-t'><span>星期五</span></div>
              <div v-for='item in courseData5' :key='item' slot='item'>
                <div class='week-c' :style="{'background':item.arrangeContradictionColor}">
                  <div>{{ item.subjectName }}</div>
                  <div>{{ item.teacherName }}</div>
                  <div>{{ item.classroomNickname }} </div>
                  <div>{{ item.classNicknameView }} </div>
                </div>
              </div>
            </div>
            <div style='width: 150px;float: left;'>
              <div class='week-t'><span>星期六</span></div>
              <div v-for='item in courseData6' :key='item' slot='item'>
                <div class='week-c' :style="{'background':item.arrangeContradictionColor}">
                  <div>{{ item.subjectName }}</div>
                  <div>{{ item.teacherName }}</div>
                  <div>{{ item.classroomNickname }} </div>
                  <div>{{ item.classNicknameView }} </div>
                </div>
              </div>
            </div>
            <div style='width: 150px;float: left;'>
              <div class='week-t'><span>星期天</span></div>
              <div v-for='item in courseData7' :key='item' slot='item'>
                <div class='week-c' :style="{'background':item.arrangeContradictionColor}">
                  <div>{{ item.subjectName }}</div>
                  <div>{{ item.teacherName }}</div>
                  <div>{{ item.classroomNickname }} </div>
                  <div>{{ item.classNicknameView }} </div>

                </div>
              </div>
            </div>
          </div>
        </div>
      </a-card>
    </a-col>
  </a-row>
</template>

<script>
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import html2canvas from 'html2canvas'
import { deleteAction, getAction, putAction } from '@api/manage'
import { getTeacherCourseDataList } from '@api/couCourseArrangeAtom'
import { getSubjectList, queryTeacherListBySubject } from '@api/commonAPI'
import Vue from 'vue'
import { YEAR_SEMESTER } from '@/store/mutation-types'

export default {
  // 课程表冲突检测
  name: 'CouCourseArrangeConflictDetection',
  mixins:[JeecgListMixin, mixinDevice],
  components: {},
  data () {
    return {
      description: 'v_cou_course_arrange_atom管理页面',
      disableMixinCreated : true, //默认初始状态不加载数据

      url: {
        //冲突检测课表
        list: "/coursearrangeatom/couCourseArrangeAtom/list",
      },
      //ref部分
      objectModel: {
          targetObjId: null,
      },
      //查询方式
      selectType: "1",
      queryParam: {
        teacherId: null,
        subjectId: null,
        classId: null,
      },
      queryParamSelect:{
        classIdSelect: "cou_class,ifnull( class_nickname !! class_name ),id,class_iz_open  =1 and class_iz_delete  = 0 order by  class_order",
        classroomIdSelect:"fac_classroom fc,ifnull( fc.classroom_nickname !! fc.classroom_name ),fc.id",
      },
      //下拉数据
      teacherList: [],
      subjectList: [],
      dataSource:[],
      classname: "",
      //下拉教师
      selectTeacherList: [],
      //课表科目查询
      courseData1: [],
      courseData2: [],
      courseData3: [],
      courseData4: [],
      courseData5: [],
      courseData6: [],
      courseData7: [],
      //选中字段
      handleEditCourseId: null,
      handleEditCourseRelObjId: null,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
    }
  },
  created() {
    // this.getSuperFieldList();
    this.initList()
    this.handleSubjectChange()  //默认初始化老师列表：默认全部老师
  },
  computed: {
    importExcelUrl: function(){
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
    },
  },
  methods: {
    initDictConfig(){
    },
    getOrderMain(record) {
      this.objectModel = record;
      this.getCourseData(1);
    },
    //教师下拉
    async initList() {
      let subjectList = await getSubjectList()
      if (subjectList.code === 200) {
        this.subjectList = []
        subjectList.result.forEach(item => {
          this.subjectList.push({
            label: item.subjectName,
            value: item.subjectId
          })
        })
      }
    },
    async handleSubjectChange() {
      let tenantId = ''
      if (localStorage.length > 0) {
        let localData = JSON.parse(localStorage.getItem('pro__Login_Userinfo'))
        tenantId = localData.value.tenantId
        // this.model.tenantId = tenantId
      }
      let params = {
        tenantId: tenantId,
        subjectId: this.queryParam.subjectId
      }
      // if (this.queryParam.subjectId !== null){
      //不管是否null，都可以查询
        let res = await queryTeacherListBySubject(params)
        if (res.success) {
          this.teacherList = []
          res.result.forEach(item => {
            this.teacherList.push({
              value: item.teacherId,
              label: item.teacherName
            })
          })
        }


    },
    //更改教学楼-->选择教室
    changeBuildingId(){
      if(this.queryParam.buildingId != null || this.queryParam.buildingId != ''){ //判断不为空
        this.queryParamSelect.classroomIdSelect = "fac_classroom fc,ifnull( fc.classroom_nickname !! fc.classroom_name ),fc.id ,fc.building_id = \'"+ this.queryParam.buildingId + "\'" ;
      }
      if(this.queryParam.buildingId == null || this.queryParam.buildingId == ''){ //判断不为空
        this.queryParamSelect.classroomIdSelect = "fac_classroom fc,ifnull( fc.classroom_nickname !! fc.classroom_name ),fc.id" ;
      }
    },
    //冲突检测数据
    handleGetData(checkContradiction){
      // if (this.objectModel.targetObjId == null || this.objectModel.targetObjId == ""){
      //   alert("请先选择一条班级课表！");
      //   return;
      // }
      //初始化
      this.courseData1 = [],
      this.courseData2 = [],
      this.courseData3 = [],
      this.courseData4 = [],
      this.courseData5 = [],
      this.courseData6 = [],
      this.courseData7 = [],
      this.getCourseData(checkContradiction)
    },
    //更改年级-->选择考试，选择班级
    changeGradeId(){
      if( this.queryParam.gradeId   ){ //判断不为空
        this.queryParamSelect.classIdSelect = "cou_class,ifnull( class_nickname !! class_name ),id,class_iz_open  =1 and class_iz_delete  = 0 and grade_code=\'"+ this.queryParam.gradeId + "\' order by  class_order" ;
      }
    },

    //ttype类型 教师 没有无影响（废除时将前后端都要废除）
    async getCourseData(checkContradiction) {
      if(!checkContradiction){
        // console.log('checkContradiction(1检测，0查询不检测)='+checkContradiction)
        checkContradiction =0; //给默认值
      }
      var params;
      // if((this.queryParam.classId != null || this.queryParam.classId != '' ) || ( this.queryParam.teacherId != null && this.queryParam.teacherId != '' )){
      //只要选择了查询条件即可
      if(this.queryParam.classId || this.queryParam.teacherId || this.queryParam.subjectId|| this.queryParam.classroomId ){
        params = {
          courseArrangeId: null,
          teacherId:this.queryParam.teacherId,
          subjectId: this.queryParam.subjectId,
          classId: this.queryParam.classId,
          classroomId: this.queryParam.classroomId,
          checkContradiction: checkContradiction,
          schoolYearId: Vue.ls.get(YEAR_SEMESTER).schoolYearId,
          semesterId: Vue.ls.get(YEAR_SEMESTER).semesterId
        }
      }else{
        params = {
          courseArrangeId: this.objectModel.id,
          checkContradiction: checkContradiction,
          schoolYearId: Vue.ls.get(YEAR_SEMESTER).schoolYearId,
          semesterId: Vue.ls.get(YEAR_SEMESTER).semesterId
        }
      }
      console.log('params='+params)
      //如果参数校验不通过
      if(! this.checkQueryParam(params) ){
        return ;
      }
      let res = await getTeacherCourseDataList(params)
      if (res && res.code === 200) {
        let datas = res.result
        this.courseData1 = datas.filter((item) => { return item.courArraAtomWeekday === 1 })
        this.courseData2 = datas.filter((item) => { return item.courArraAtomWeekday === 2 })
        this.courseData3 = datas.filter((item) => { return item.courArraAtomWeekday === 3 })
        this.courseData4 = datas.filter((item) => { return item.courArraAtomWeekday === 4 })
        this.courseData5 = datas.filter((item) => { return item.courArraAtomWeekday === 5 })
        this.courseData6 = datas.filter((item) => { return item.courArraAtomWeekday === 6 })
        this.courseData7 = datas.filter((item) => { return item.courArraAtomWeekday === 7 })
      }
      //页面总弹出“暂无数据”，在此处注释
      // else {
      //   this.$message.error("暂无数据")
      // }
    },
    //重置冲突检测参数
    initQueryParam(){
      this.queryParam = {}
      this.handleSubjectChange()  //默认初始化老师列表：默认全部老师
    },
    //校验查询条件：通过ture，不通过false
    checkQueryParam(params){
      if(!params.courseArrangeId && !params.teacherId && !params.classId && !params.classroomId){
        this.$message.success("请选择课表 或老师和班级！");
        return false;
      }
      // if( params.courseArrangeId && !params.teacherId && !params.classId){
      //   this.$message.success("请选老师和班级！");
      //   return false;
      // }
      return true;
    },
    // 重写loadData 和searchQuery，让其失效，查询是手动触发，并不自动触发，解决默认参数不够的报错
    loadData(){},
    searchQuery() {
      //查询条件校验不通过
      if( !this.checkQueryParam()){
        return;
      }
      this.getOrderMain(record);

    },
    searchReset() {
      this.queryParam = {}
      // this.loadDataTrRow2Col(1);
    },


  }
}
</script>

<style scoped>
.week-t {
  background-color: #fafafa;
  height: 40px;

  color: #151515;
  line-height: 40px;
  font-weight: bold;
}
.week-c {
  height: 75px;
  border-top: 1px solid #e2e2e2;
  border-right: 1px solid #e2e2e2;
  line-height: 17px;
  font-size: 12px;
}
.week-c:hover {
  background-color: #e2e1e1;
  transition: all 0.5s;
}
.select-box {
  z-index: 9999;
  font-size: 18px;
  color: #ffffff;
  border-radius: 50px;
  padding: 5px;
  display: flex;
  position: absolute;
  background: #09ad4b;
  width: 27px;
  height: 27px;
}
@import '~@assets/less/common.less';
</style>